<%--
  Created by IntelliJ IDEA.
  User: ZENG
  Date: 2021/8/20
  Time: 22:12
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>$Title$</title>
</head>
<body>
<form action="#" method="post" id="frmInfo">
    <div id="error" style="color: red">

    </div>
    <div>
        姓名:<input id="name" name="name">
    </div>
    <div>
        身份证:<input id="idno" name="name">
    </div>
    <div>
        <input type="submit">
    </div>
</form>
<script type="text/javascript">
    // 表弟校验提交事件
    document.getElementById("frmInfo").onsubmit = function () {
        // 在JS中定义正则表达式对象只需要在/正则表达式/
        var regex1 = /^[\u4e00-\u9fa5]{2,8}$/;
        var regex2 = /^[1-6]\d{16}[1-9xX]$/;
        var name = document.getElementById("name").value;
        var idno = document.getElementById("idno").value;
        // 匹配返回true 匹配 false 不匹配
        if (regex1.test(name) == false) {
            document.getElementById("error").innerHTML = "无效姓名";
            // 表单不提交
            return false;
        } else if (regex2.test(idno) == false) {
            document.getElementById("error").innerHTML = "无效的身份证号码";
            // 表单不提交
            return false;
        } else {
            alert("验证通过，准备提交");
            return true;
        }
    }
</script>
</body>
</html>
